<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>哔哩哔哩弹幕视频网</title>
    <link rel="stylesheet" href="stylesheets/index.css">
    <link rel="stylesheet" href="stylesheets/reset.css">
    <link rel="stylesheet" href="stylesheets/register.css">
</head>
<body>
    <div id="app">
        <!--nav-->
        <div id="reg-log-page" class="bili-header-m"></div>
        <!--nav end-->

        <!--登录-->
        <div>
            <div class="top-banner">
                <img src="./images/rl_top.35edfde.png" alt="">
            </div>
            <div class="title-line">
                <span>登录</span>
            </div>

            <!--main-->
            <div class="login-box">
                <div class="login-left">
                    <div class="qrcode-login">
                        <div class="qrcode-con">
                            <i class="tv-icon"></i>
                            <div class="qrcode-box">
                                <div class="qrcode-tips"></div> 
                                <div class="qrcode-img">
                                    <!-- <canvas width="140" height="140" style="display: none;"></canvas>
                                    <img style="display: block;" src=""> -->
                                </div>
                                <!--当时间超时，二维码失效时，display：block-->
                                <div class="status">
                                    <div class="overdue">点击刷新</div>
                                </div>
                            </div>
                        </div>
                        <div class="qrcode-footer">
                            <p class="status-txt">扫描二维码登录</p>
                            <p class="app-link">请使用 
                                <a href="//app.bilibili.com/" target="_blank">哔哩哔哩客户端</a><br>
                                扫码登录<br>
                                或扫码下载APP
                            </p>
                        </div>
                    </div>
                </div>
                <div class="line"></div>
                <div class="login-right">
                    <div class="form-login">
                        <div id="geetest-wrap" class="input-box">
                            <ul>
                                <li class="item username status-box">
                                    <input type="text" value="" placeholder="你的昵称" id="login-username" maxlength="50" autocomplete="off" class="">
                                    <span class="status"></span>
                                    <div class="text">
                                        <!--当输入正确时，span中的内容为空-->
                                        <p class="tips"></p>
                                    </div>
                                </li> 
                                <li class="item password status-box">
                                    <input type="password" placeholder="密码" id="login-passwd" class=""> 
                                    <span class="status"></span> 
                                    <div class="text">
                                        <p class="tips"></p>
                                    </div>
                                </li>
                                <li class="item gc clearfix"></li> 
                                <li class="remember">
                                    <label>
                                        <input type="checkbox">记住我
                                        <span>不是自己的电脑上不要勾选此项</span> 
                                        <a target="_blank" href="//passport.bilibili.com/register/findpassword.html#/verify" class="forget-password">忘记密码?</a> 
                                        <a target="_blank" href="//www.bilibili.com/blackboard/help.html#%E8%B4%A6%E5%8F%B7%E7%9B%B8%E5%85%B3" class="not-checkout">无法验证?</a>
                                    </label>
                                </li> 
                                <li class="btn-box">
                                    <a class="btn btn-login">登录</a> 
                                    <a href="reigster.html" class="btn btn-reg">注册</a>
                                </li> 
                                <li class="sns">
                                    <a class="btn weibo">微博账号登录</a> 
                                    <a class="btn qq">QQ账号登录</a>
                                </li> 
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!--main end-->

        </div>
        <!--登录 end-->

        <!--底部-->
        <div class="footer"></div>
        <!--底部 end-->
    </div>

    <script src="./scripts/libs/jquery-3.4.0.js"></script>
    <script src="./scripts/libs/common.js"></script>
    <script src="./scripts/login.js"></script>
</body>
</html>